<template>
  <div>
    <div id="excelOnline" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div>
  </div>
</template>

<script>

export default {
  name: 'ExcelMenu',
  components: {},
  props:{
    paramKey: {
      type: String
    },
    storeState:{
      type: Object
    }
  },
  data(){
    return{
    }
  },
  mounted() {
    this.init()
  },
  methods:{
    init() {
      console.log('this.user.name')
      let userName = ''
      if (this.storeState!=undefined) {
        userName = this.storeState.user.user.name
      }

      let options = {
        container: 'excelOnline', //luckysheet为容器id
        title: 'Excel在线1', // 设定表格名称
        lang: 'zh', // 设定表格语言
        showinfobar: false,
        gridKey:'123',
        row:1000,
        allowUpdate: true,
        loadUrl: "http://127.0.0.1:10003/nosql/excel/load/"+this.paramKey,
        loadSheetUrl: "http://127.0.0.1:10003/nosql/excel/loadSheet/"+this.paramKey,
        updateUrl: "ws://127.0.0.1:10003/nosql/ws/" + userName + "/"+this.paramKey
      }
      luckysheet.create(options)
    }
  }
}
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    margin: 30px;
  }
  &-text {
    font-size: 16px;
    line-height: 46px;
    color: #333333;
  }
}
</style>

<style lang="less" scoped>
  #mytaskwaitingmenu {
    cursor: pointer;
    color: #666;
    :hover{
      color: red;
    }
  }

  #task_mytaskwaiting {
    width: 100%;
    height: 100%;
    /*padding-right: 10px;*/

    .header {
      height: 40px;
      width: 100%;
      font-size: 15px;
      /*align-items: center;*/
      text-align: center;
      display: flex;
      color: #666;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      /*border-radius: 15px;*/
    }

    .seamless-warp {
      height: calc(~"100% - 100px");
      width: 100%;
      /*overflow: hidden;*/
      overflow: auto;
      font-size: 14px;

      .item {
        width: 100%;
        height: 100%;
        list-style: none;
        line-height: 40px;
        margin: 0;
        padding: 0 2px 0 2px;

        li {
          width: 100%;
          height: 100%;
          cursor: pointer;
          color: #666;
          :hover{
            color: red;
          }
          span {
            width: 25%;
            font-weight: normal;
            text-align: center;
            float: left;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            padding-left: 10px;
          }
        }
      }
    }
  }
</style>
